<template>
  <div class="about">
    <!-- 全局组件引用 -->
    <zdyHeader></zdyHeader>
    <h1 v-for="(item,index) in mockData" :key="index">{{item.id}}</h1>
    <headerZdy></headerZdy>
    <order></order>
    <p v-zhou="color">123456</p>
    <footerZdy> </footerZdy>
  
    <!-- 局部组件引用 -->
  </div>
</template>
<script>
import Mock from "mockjs"; // node方式引入 (CommonJS)
import request from '@/utils/request.js'
import headerZdy from '../components/directive/componment/header' //引入自定义组件 通过import引入 通过components实例化使用
import footerZdy from '@/components/directive/componment/footer'
import order from "../components/directive/order/index"
request({
  url: '/test',
  method: 'get'
}).then(res => {
  console.log(res)
  // 拿到 {code:0, msg:'执行成功'}
})
// Mock.mock('/list', { //输出数据
//     'age|10-20': 10
//     //还可以自定义其他数据
// });
export default {
  name: "HelloWorld",
  data() {
    return {
      mockData: [], // 生成数据
      message: null
    };
  },
  components: {
    headerZdy: headerZdy,
    footerZdy,
    order
  },
  created() {
    this.getRandom();
  },
  mounted() { },
  methods: {
    getRandom() {
      var data = Mock.mock({
        //生成数据规则
        "list|1-10": [
          {
            "id|+1": 1
          }
        ]
      });
      this.mockData = data.list
    },

  }
};
</script>
<style scope></style>


